<template>
  <el-dialog
    :visible="visible"
    :append-to-body="true"
    :close-on-click-modal="false"
    title="审批通过"
    width="450px"
    @close="handleCancel"
  >
    <div class="handle-box">
      <div class="item">
        <span class="title"><i>*</i>收款截图</span>
        <div class="mt-10">
          <xh-files
            :value="filesList"
            :disabled="false"
            @value-change="oldChange($event, item, index)"
          />
          <el-button type="primary">点击上传</el-button>
        </div>
      </div>
      <div class="item mt-20">
        <span class="title">备注</span>
        <el-input type="textarea" class="mt-10"></el-input>
      </div>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click.native="handleCancel">取消</el-button>
      <el-button v-debounce="handleConfirm" type="primary">保存</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { XhFiles } from "@/components/CreateCom";
export default {
  props: {
    visible: {
      type: Boolean,
      required: true,
      default: false
    },
    // 操作数据
    selectionList: {
      type: Array,
      default: () => {
        return [];
      }
    }
  },
  components: {
    XhFiles
  },
  data() {
    return {
      filesList: []
    };
  },
  methods: {
    /**
     * 取消选择
     */
    handleCancel() {
      this.$emit("update:visible", false);
    },

    /**
     * 确定
     */
    handleConfirm() {}
  }
};
</script>

<style lang="scss" scoped>
.handle-box {
  .title {
    color: #666;
    i {
      color: #e91f1f;
    }
  }
}
/deep/ .el-dialog__title {
  color: #000;
  font-weight: bold !important;
}
/deep/ .el-dialog__body {
  padding: 15px 20px 30px;
}
</style>
